const webpack = require('webpack')
const baseConfig = require('./webpack.common')

const { merge } = require('webpack-merge')
const CopyWebpackPlugin = require('copy-webpack-plugin')
const MiniCssExtractPlugin = require('mini-css-extract-plugin')

module.exports = merge(baseConfig, {
  mode: 'production',
  devtool: 'none',
  optimization: {
    //  只导出被使用了
    usedExports: true,
    // 去除没有用到的
    minimize: true,
  },
  module: {
    rules: [
      {
        test: /\.css?$/,
        // 使用MiniCssExtractPlugin将css提取到单独的文件中
        use: [MiniCssExtractPlugin.loader, 'css-loader']
      }
    ]
  },
  plugins: [
    // 开发阶段最好不要使用这个插件，在开发过程中，会频繁打包，所以只需要在上线前用这个插件
    new CopyWebpackPlugin(["public"]),
    // 打包成单独css文件的文件名
    new MiniCssExtractPlugin({
      filename: 'main.css'
    }),
  ]
})